/*
 * @Author: your name
 * @Date: 2021-05-11 17:25:32
 * @LastEditTime: 2021-05-11 18:05:46
 * @LastEditors: your name
 * @Description: In User Settings Edit
 * @FilePath: /github/react-demo/src/Router/index.tsx
 */
import { Switch, Route, Redirect } from 'react-router-dom'
import React, { FC, CSSProperties } from 'react'
import { HomeOutlined } from '@ant-design/icons'
import Loadable from 'react-loadable'
import { Spin } from 'antd'
const style: CSSProperties = {
	position: 'fixed',
	left: '50%',
	top: '50%',
	transform: 'translate(-50%,-50%)',
}
const Index = Loadable({
	loader: () => import('@/pages/index/Index'),
	loading() {
		return <Spin style={style} tip='正在加载...' delay={300} />
	},
})
const Notfound = Loadable({
	loader: () => import('@/pages/404/Notfound'),
	loading() {
		return <Spin style={style} tip='正在加载...' delay={300} />
	}
})
const Action = Loadable({
	loader: () => import('@/pages/action/Action'),
	loading() {
		return <Spin style={style} tip='正在加载...' delay={300} />
	}
})
const route = [
	{
		path: '/',
		key: '',
		component: Index,
		name: '首页',
		icon: HomeOutlined,
	},
	{
		path: '/config',
		key: '/config',
		component: Index,
		name: '资产折旧预测配置',
		icon: HomeOutlined,
	},
	{
		path: '/action',
		key: '/action',
		component: Action,
		name: '折旧测算操作',
		icon: HomeOutlined,
	},
	{
		path: '/search',
		key: 'search',
		component: Index,
		name: '折旧测算查询',
		icon: HomeOutlined,
	},
	{
		path: '/depreciation',
		key: 'depreciation',
		component: Index,
		name: '折旧预测',
		icon: HomeOutlined,
	},
	{
		path: '/money',
		key: 'money',
		component: Index,
		name: '准许收益',
		icon: HomeOutlined,
	},
	{
		path: '/404',
		key: '404',
		component: Notfound,
		name: '准许收益',
		icon: HomeOutlined,
	},
]
export default route
export const Router: FC = () => (
	<Switch>
		{route.map(item => (
			<Route key={item.key} path={item.path} exact component={item.component}></Route>
		))}
	</Switch>
)
